<!DOCTYPE html>
<html>

<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
	<title>实名认证</title>

	<link rel="stylesheet" href="./css/format.css" />
	<link rel="stylesheet" href="./css/mint-min.css" />
	<link rel="stylesheet" href="./css/register.css" />
	<link rel="stylesheet" href="./component/component.css" />
</head>

<body>
	<div id="app">
		<register-stepper step="1"></register-stepper>
		<div class="register-upload-wrapper">
			<h3>拍摄上传您的身份证正面与反面</h3>
			<div class="register-upload-uploaders">
				<div class="register-upload-uploader-btn" @click="uploadPic('uploaderFront')"
					:style="uploaderFront && 'background: transparent'">
					<img v-if="!uploaderFront" src="./img/icon_idfront.svg" />
					<img v-if="uploaderFront" :src="uploaderFront" />
					<input type="file" name="file" accept="image/*" ref="uploaderFront" class="register-upload-input"
						capture="camera" @change="onFileChange('uploaderFront', $event)" mutiple="mutiple" />
				</div>
				<div class="register-upload-uploader-btn" @click="uploadPic('uploaderBack')"
					:style="uploaderBack && 'background: transparent'">
					<img v-if="!uploaderBack" src="./img/icon_idreverse.svg" />
					<img v-if="uploaderBack" :src="uploaderBack" />
					<input type="file" name="file" accept="image/*" ref="uploaderBack" class="register-upload-input"
						capture="camera" @change="onFileChange('uploaderBack', $event)" mutiple="mutiple" />
				</div>
			</div>
			<h4>扫描上传时确保身份证边框完整，字体清晰，亮度均匀</h4>
			<div class="register-examples">
				<div class="register-examples-item">
					<img src="./img/icon_idstandard.svg" />
					<span>标准</span>
				</div>
				<div class="register-examples-item">
					<img src="./img/icon_idlost.svg" />
					<span>边缘缺失</span>
				</div>
				<div class="register-examples-item">
					<img src="./img/icon_idblur.svg" />
					<span>对较模糊</span>
				</div>
			</div>
		</div>
		<div class="register-information-input-wrapper">
			<div class="register-information-input">
				<label><i>*</i>姓名：</label>
				<input v-model="username" />
			</div>
			<div class="register-information-input">
				<label><i>*</i>身份证号：</label>
				<input v-model="idNo" type="tel" />
			</div>
		</div>
		<div class="register-check-wrapper">
			<div class="register-check-checkBox-out" @click="checkToggle">
				<span v-show="!checked" class="register-check-checkBox"></span>
				<img src="./img/icon_agree.svg" v-show="checked" class="register-check-checkBox-checked" />
			</div>
			<p>
				已阅读并同意<i @click.stop="jump('xieyi', 'zhongyuan')">《中原银行服务协议》</i>、<i
					@click.stop="jump('xieyi', 'xima')">《喜马拉雅服务协议》</i>，并承诺本人是中国税收居民
			</p>
		</div>
		<wide-red-button title="下一步" :disabled="disabled" @click="goNextStep"></wide-red-button>
	</div>
	<div id="containter" style="display: none"></div>
</body>
<script src="./util/vconsole.min.js"></script>
<script src="./util/vue.min.js"></script>
<script src="./util/rem.js"></script>
<script type="text/javascript" src="./util/mint-min.js"></script>
<script src="./util/regConfig.js"></script>
<script src="./component/stepper.js"></script>
<script src="./component/wide-red-button.js"></script>
<script type="text/javascript" src="util/util.js"></script>
<script src="./js/register.js"></script>

</html>